import {Menu, theme,Layout } from 'antd';
import React from 'react';
import {useNavigate,useLocation} from 'react-router-dom';
const { Sider } = Layout;
const items2 = [ {
        key:"/nav/home",
        label:"首页",
    },
    {
        key:"shop",
        label:"店铺管理",
        children:[
            {
                key:"/nav/shopList",
                label:"店铺列表"
            },
            {
                key:"/nav/addShop",
                label:"新增店铺"
            },
        ]
    },
    {
        key:"account",
        label:"账号管理",
        children:[
            {
                key:"/nav/accountsList",
                label:"账号列表"
            },
            {
                key:"/nav/addAccount",
                label:"新增账号"
            },
        ]
    }];
export default function MyHeader(){
	const {
	  token: { colorBgContainer },
	} = theme.useToken();
	 const navigate = useNavigate();
	function onChoose(val){
		const keys = val.keyPath[1];
		navigate(val.key,{state:keys})
	}
	return (
	    <Sider
	         width={200}
	         style={{
	           background: colorBgContainer,
	         }}
	       >
	         <Menu
	           mode="inline"
	           defaultSelectedKeys={[location.pathname]}
	           defaultOpenKeys={[location.state]}
	           style={{
	             height: '100%',
	             borderRight: 0,
	           }}
	           items={items2}
			   onClick={onChoose}
	         />
	       </Sider>
	)
}
 